<!doctype html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Light Theme</title>
<link href="css/singlePageTemplate.css" rel="stylesheet" type="text/css">
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->
<script>var __adobewebfontsappname__="dreamweaver"</script>
<script src="http://use.edgefonts.net/source-sans-pro:n2:default.js" type="text/javascript"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!-- Main Container -->
<div class="container"> 
  <!-- Navigation -->
  <header> <a href="">
    <h4 class="logo">ZZHANG&nbsp;</h4>
    </a>
    <nav>
      <ul>
        <li><a href="#hero">MY</a></li>
        <li><a href="#about">introduction</a></li>
		  
      </ul>
    </nav>
  </header>
  <!-- Hero Section -->
<section class="hero" id="hero">
    <h2 class="hero_header">Welcome to my homepage <span class="light">&gt;&gt;</span></h2>
    <p>&nbsp;</p>
    <p class="tagline">Zero in your target,and go for it！ </p>
    <p class="tagline">NAME: ZHANG HANDAN&nbsp;</p>
    <p class="tagline">STUDENT NUMBER:20182163</p>
    <p class="tagline">My link：&nbsp;http://zzhang11.gitee.io/zzfannn</p>
</section>
  <!-- About Section -->
  <section class="about" id="about">
    <h2 class="hidden">About</h2>
    <p class="text_column">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;1
	<p class="text_column">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;2<br>
	<p class="text_column">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;3<br>
    </p>
    <p class="text_column">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;Nationality: Chinese </p>
        <p class="text_column"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Province: Sichuan</p>
    <p class="text_column">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;Geographical Location: Southwest China</p>
	    
  </section>
  <!-- Stats Gallery Section -->
  <div class="gallery">
    <div class="thumbnail">
      <h1 class="stats">Major</h1>
      <h4>Management</h4>
      <p>&nbsp;</p>
    </div>
    <div class="thumbnail">
      <h1 class="stats">Date of birth</h1>
      <h4>1997/09/15</h4>
      <p>&nbsp;</p>
    </div>
    <div class="thumbnail">
      <h1 class="stats">Gender</h1>
      <h4>Female</h4>
      <p>&nbsp;</p>
    </div>
    <div class="thumbnail">
      <h1 class="stats">Undergraduate</h1>
      <h4>Sojiang University</h4>
      <p>&nbsp;</p>
    </div>
</div>
  <!-- Parallax Section -->
<section class="banner">
    <h2 class="parallax">Self introduction</h2>
    <p class="parallax_description">I come from Sichuan, China, and I am currently studying at Sogang University in South Korea. I usually like to watch TV, read books, and cook. I hate sports, so I don’t like shopping. I prefer to do some things quietly at home rather than going out. I like to participate in charity activities. I have been a volunteer several times before, and I feel that I have gained a lot and it is very meaningful.</p>
  </section>
  <!-- More Info Section -->
<footer>
	</article>
    <article class="footer_column">
	  <h3>volunteer activity 1</h3>
      <img src="image/1.jpg" alt="" width="700" height="476" class="cards"/>
      <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Hold up tomorrow's hope with our love </p>
    </article>
	<article class="footer_column">
      <h3>volunteer activity 2 </h3>
      <img src="image/2.jpg" alt="" width="690" height="456" class="cards"/>
      <p>&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;Committed to public welfare, love makes the future </p>
      <p>&nbsp;</p>
    </article>
    <article class="footer_column">
      <h3>volunteer activity 3</h3>
      <img src="image/3.jpg" alt="" width="1920" height="1080" class="cards"/>
      <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Helping people makes a person happy </p>
</article>
    <article class="footer_column">
      <h3>volunteer activity 4</h3>
      <img src="image/4.jpg" alt="" width="1024" height="640" class="cards"/>
      <p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Volunteering is a way of life </p>
</article>
     <article class="footer_column">
	
    </article>
  </footer>
  <!-- Footer Section -->
  <section class="footer_banner" id="contact">
    <h2 class="hidden">Footer Banner Section </h2>
    <p class="hero_header">An authentic Sichuan girl</p>
    <div class="button">Zhang Zhang</div>
  </section>
  <!-- Copyrights Section -->
  <div class="copyright">&copy;2021- Welcome to visit <strong>&nbsp;</strong></div>
</div>
<!-- Main Container Ends -->
</body>
</html>